<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>客户界面</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
        
        table {
            width: 100%;
            margin: 10px;
        }
        
        table th {
            text-align: center;
        }
        
        table td {
            text-align: center;
        }
        
        a {
            display: inline-block;
            text-emphasis: none;
            color: orange;
        }
    </style>
</head>

<body>
    <!-- <div class="main_right_top2">
        <i class="fa fa-search" aria-hidden="true"></i> 查询结果
        <div class="top2_in">
            <input type="submit" class="input03" value="删除选中">
            <a href="${pageContext.request.contextPath}/customer/insertCustomer.jsp"><input type="button" class="input04" value="添加客户"></a> <br>
        </div>
    </div> -->

    <a id="aadd" href="">添加跟踪信息</a>


    <h1>跟踪信息</h1>
    <table align="center" cellspacing="0">
        <tr style="font-weight:bolder; background-color: orange;">
<!--            <th><input type="checkbox"></th>-->
            <th>信息编号</th>
            <th>客户姓名</th>
            <th>员工姓名</th>
            <th>跟踪记录</th>
            <th>意向</th>
            <th>操作</th>
        </tr>
        <tbody id="table1"></tbody>
    </table>
    <div style="width: 100%;">
        <span onclick="firstPage()">首页</span>
        <span onclick="prePage()">上一页</span>
        <span onclick="nextPage()">下一页</span>
        <span onclick="lastPage()">尾页</span>


        <span>共<b id="total">0</b>条数据</span><span style="display: inline-block; width: 5px"></span>
        <span>第<b id="pageNum">0</b>页</span>
        <span>共<b id="pages">0</b>页</span>
    </div>

    <script src="../js/jquery-3.6.0.js"></script>

    <script type="text/javascript">

        var url = location.href;
        var eid = url.substring(url.lastIndexOf("=") + 1);

        var a = document.getElementById("aadd");
        a.href = 'addTrack.html?eid='+eid;

        var pageNum = 1;
        var pageSize = 5;

        getTrackList(pageNum, pageSize);

        function firstPage() {
            this.pageNum = 1;
            getTrackList(pageNum, pageSize);
        }

        function prePage() {
            if(pageNum <= 1){
                alert("已经是第一页了，无法上一页");
                return;
            }
            this.pageNum -= 1;
            getTrackList(pageNum, pageSize);
        }

        function nextPage() {
            if(pageNum >= $("#pages").html()) {
                alert("已经是最后一页了，没有下一页");
                return;
            }
            this.pageNum += 1;
            getTrackList(pageNum, pageSize);
        }

        function lastPage() {
            this.pageNum = $("#pages").html();
            getTrackList(pageNum, pageSize);
        }

        function getTrackList(pageNum, pageSize) {
            $.ajax({
                url: "/tra",
                type: "get",
                data: {
                    pageNum: pageNum,
                    pageSize: pageSize
                },
                success: function(respTxt) {
                    var tracks = respTxt.data;

                    $("#table1").empty();
                    if (tracks.size != 0) {
                        for (var tk of tracks.list) {
                            var tr = $("<tr></tr>");
                            var td1 = $("<td>" + tk.tid + "</td>");
                            var td2 = $("<td></td>");
                            if(tk.customer != null) {
                                td2 = $("<td>" + tk.customer.cname + "</td>");
                            }
                            var td3 = $("<td></td>");
                            if(tk.emp != null) {
                                td3 = $("<td>" + tk.emp.ename + "</td>");
                            }
                            var td4 = $("<td>" + tk.record + "</td>");
                            var td5 = $("<td>" + tk.intention + "</td>");
                            var td6 = $("<td><span style='margin-left:10px;' class='sc'>删除</span><span style='margin-left:10px;' class='xg'>修改</span> </td>");

                            tr.append(td1);
                            tr.append(td2);
                            tr.append(td3);
                            tr.append(td4);
                            tr.append(td5);
                            tr.append(td6);

                            $("#table1").append(tr);
                        }
                        //初始化分页
                        $("#total").html(tracks.total);
                        $("#pageNum").html(tracks.pageNum);
                        $("#pages").html(tracks.pages);

                    } else if(pageNum > 1) {
                        pageNum -= 1;
                        getTrackList(pageNum, pageSize);
                    }
                }
            });
        }

        //删除操作
        // $(".sc").click(function() {
        $("table").on("click",".sc",function () {
            var flag = window.confirm("你确定要删除这条数据吗？不可恢复！");
            if (!flag) {
                return;
            }
            var td1 = $(this).parent().prevAll().last();
            var tid = td1.html();

            $.ajax({

                url: "/tra/"+tid,
                type: "post",
                data: {
                    _method: "delete",
                },
                success: function(respTxt) {
                    if (respTxt.data == 1) {
                        alert("删除成功！");

                    } else {
                        alert("删除失败！");
                    }
                }
            });
            getTrackList(pageNum, pageSize);
        });


        // 修改操作
        // $(".xg").click(function() {
        $("table").on("click",".xg",function () {
            var td1 = $(this).parent().prevAll().last();
            var tid = td1.html();
            location.href = "updateTrack.html?tid=" + tid;
        });
    </script>

</body>

</html>
